<template>
    <div class="app-container">
        <div style="text-align: center;margin-bottom: 30px">
            任务{{ createStatus ? '新增' : '更新' }}
        </div>
        <el-form :model="taskForm" ref="taskForm" :rules="taskFormRules" label-width="120px">
            <el-row :gutter="10">
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="任务名称" prop="name">
                        <el-input type="text" v-model="taskForm.name" placeholder="请输入任务名称" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                  <el-form-item label="任务类型" prop="taskType">
                    <el-select style="width: 100%" v-model="taskForm.type" placeholder="请选择任务类型">
                      <el-option v-for="(item,index) in taskTypeList" :key="index" :value="item.id"
                                 :label="item.title"></el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                <el-form-item label="所属区域" prop="regionId">
                    <el-select v-model="taskForm.regionId" placeholder="请选择所属区域" style="width: 100%" @change="getInUserList">
                        <el-option v-for="(item,index) in regionList" :key="index" :value="item.ucId" :label="item.name"></el-option>
                    </el-select>
                </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="任务描述" prop="remark">
                        <el-input v-model="taskForm.remark" placeholder="请输入任务描述" clearable></el-input>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl=12>
                    <el-form-item label="任务开始时间" prop="startTime">
                        <el-time-picker style="width: 100%"
                                        v-model="taskForm.startTime"
                                        :picker-options="{
                                       selectableRange: '00:00:00 - 23:59:59'
                                      }"
                        >
                        </el-time-picker>
                    </el-form-item>

                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="12" :xl=12>
                    <el-form-item label="任务结束时间" prop="endTime">
                        <el-time-picker style="width: 100%"
                                        v-model="taskForm.endTime"
                                        :picker-options="{
                                       selectableRange: '00:00:00 - 23:59:59',
                                       minTime:taskForm.startTime
                                }"
                        >
                        </el-time-picker>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="所属主体" prop="enterpriseId">
                        <el-select v-model="taskForm.enterpriseId" placeholder="请选择主体" style="width: 100%">
                            <el-option v-for="(item,index) in enterpriseDominantList" :key="index"  :value="item.ucId" :label="item.name"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
                    <el-form-item label="任务状态" prop="status">
                        <el-switch v-model="taskForm.status" active-color="#13ce66" inactive-color="#ff4949"></el-switch>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="是否是固定任务" >
                        <el-switch v-model="taskForm.isFixedTask" :change="fixedChange()  " active-color="#13ce66" inactive-color="#ff4949">
                        </el-switch>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="12" :lg="12" :xl="8">
                    <el-form-item label="执行人员" prop="userId" v-if="taskForm.isFixedTask==true">
                        <el-select v-model="taskForm.userId" placeholder="请选择执行人员" style="width: 100%">
                            <el-option v-for="(item,index) in userList" :key="index"  :value="item.ucId" :label="item.disPlayName"></el-option>
                        </el-select>
                    </el-form-item>
                </el-col>
                <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl=24>
                    <el-form-item label="任务内容" prop="content">
                        <el-input type="textarea" :rows="2" v-model="taskForm.content" placeholder="请输入任务描述" clearable></el-input>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <div slot="footer" style="text-align: center" class="dialog-footer">
            <el-button @click="cancelAction">取 消</el-button>
            <el-button :loading="addLoading" v-if="createStatus" type="primary" @click="createTask">创 建
            </el-button>
            <el-button :loading="addLoading" v-else type="primary" @click="updateAction">修 改</el-button>
        </div>
    </div>


</template>

<script>
import {getInTaskVo,addInTask,updateInTask} from "@/api/taskinfo";
import {getInUserList} from "@/api/enterprise";
import {getInEnterpriseDominantList} from "@/api/enterpriseDominant";
import {getInRegionList} from "@/api/region";
import {getTaskType} from "../../../api/dailyTasks";

export default {
    name: "taskEdit",
    data() {
        return {
            taskForm: {
               cycle:1,
                pollTimeStr:'',
            },
            addLoading: false,
            enterpriseDominantList:[],
            userList:[],
            taskFormRules:{
                name: [{required: true, message: '任务名称不能为空', trigger: 'blur'}],
                content: [{required: true, message: '任务内容不能为空', trigger: 'blur'}],
                enterpriseId :[{required: true, message: '所属企业不能为空', trigger: 'blur'}],
                type :[{required: true, message: '任务类型不能为空', trigger: 'blur'}],
                remark :[{required: true, message: '任务描述不能为空', trigger: 'blur'}],
                 },
            cronPopover:false,
            cron:'',
            regionList:[],
          taskTypeList:[],
        }
    },
    computed: {
        createStatus() {
            return this.$route.params.ucId == '0'
        },
    },
    created() {
      this.getTask()
        this.getInEnterpriseDominantList()
        this.getInUserList()
        if (!this.createStatus) {
            let ucId = this.$route.params.ucId
            this.getInTaskVo(ucId)
        }
        this.getInRegionList()
    },
    methods: {
      getTask(){
        getTaskType({name:"TaskEnum"}).then(res=>{
          this.taskTypeList=res.data
        }).catch(res=>{
          console.log("失败")
        })
      },
        getInRegionList(val){
            console.log(val)
            getInRegionList({}).then(res=>{
                this.regionList = res.data
            }).catch(error=>{
                console.log(error)
            })
        },
        changeCron(val){
            this.cron=val
        },
        getInTaskVo(val) {
            getInTaskVo({ucId: val}).then(res => {
                this.taskForm = res.data
            }).catch(res => {

            })
        },
        fixedChange(){
            if(this.taskForm.isFixedTask==false){
                this.taskForm.userId=null;
            }
        },
        cancelAction() {
          window.history.back()
        },
        createTask() {
            this.addLoading = true
            this.$refs['taskForm'].validate(valid => {
                if (valid) {
                    addInTask(this.taskForm).then(res => {
                        this.addLoading = false
                        this.$notify.success({
                            title: '成功',
                            message: "添加任务成功"
                        })
                        this.cancelAction()
                    }).catch(res => {
                        this.addLoading = false
                        this.$notify.error({
                            title: '失败',
                            message: res.msg
                        })
                    })
                } else {
                    this.addLoading = false
                    console.log("表单验证不通过")
                }
            })
        },
        updateAction() {
            this.addLoading = true
            this.$refs['taskForm'].validate(valid => {
                if (valid) {
                    updateInTask(this.taskForm).then(res => {
                        this.addLoading = false
                        this.$notify.success({
                            title: '成功',
                            message: "更新任务成功"
                        })
                        this.cancelAction()
                    }).catch(res => {
                        this.addLoading = false
                        this.$notify.error({
                            title: '失败',
                            message: res.msg
                        })
                    })
                } else {
                    this.addLoading = false
                    console.log("表单验证不通过")
                }
            })
        },
        getInEnterpriseDominantList(){
            getInEnterpriseDominantList({deleted:false}).then(res=>{
                this.enterpriseDominantList = res.data
            }).catch(error=>{

            })
        },
        getInUserList() {
            getInUserList({deleted: false}).then(res => {
                this.userList = res.data
            }).catch(error => {

            })
        }


    }

}
</script>
